<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport"/>
<meta http-equiv="X-UA-Compatible" content="IE=edge"/>
    
   <script type="text/javascript" src="../js/jquery-3.2.0.min.js"></script>
    <script>
        $(document).ready(function () {
            $(".btn").click(function () {
                $("#code").html("");
                var submitData = {
                    "amount": $("#amount").val(),
                    "client_ip": $("#clientIp").val(),
                    "notify_url": $("#notifyUrl").val(),
                    "order_id": $("#orderId").val(),
                    "product_desc": $("#productDesc").val(),
                    "product_ext": $("#productExt").val(),
                    "product_name": $("#productName").val(),
                    "pay_ment": $("#pay_ment").val(),
                    "service_type": $("#serviceType").val()
                };
                $.ajax({
                    type: "post",
                    url: "./pay.php",
                    data: submitData,
                    datatype: "json",

                    success: function (msg) {
                        var result = $.parseJSON(msg);
                        console.log(result);
                        if (result.result == 1) {
                            window.open(result.message);
                        } else
                            alert(result.message);
                    },
                    error: function (e) {
                        alert("未知错误")
                    }
                });
            })
        });
    </script>
</head>
<body>
<div class="container bs-docs-container">
    <div class="bs-example" style="margin-top:20px;">
        <form>
            <div class="form-group">
                <label for="amount">支付金额</label>
                <input type="text" class="form-control" name="amount" id="amount">
            </div>
            <div class="form-group">
                <label for="clientIp">客户端ip</label>
                <input type="text" class="form-control" name="clientIp" id="clientIp">
            </div>
            <div class="form-group">
                <label for="clientIp">回调地址</label>
                <input type="text" class="form-control" name="notifyUrl" id="notifyUrl">
            </div>
            <div class="form-group">
                <label for="clientIp">订单编号</label>
                <input type="text" class="form-control" name="orderId" id="orderId">
            </div>
            <div class="form-group">
                <label for="clientIp">产品描述</label>
                <input type="text" class="form-control" name="productDesc" id="productDesc">
            </div>
            <div class="form-group">
                <label for="clientIp">产品扩展属性</label>
                <input type="text" class="form-control" name="productExt" id="productExt">
            </div>
            <div class="form-group">
                <label for="clientIp">产品名称</label>
                <input type="text" class="form-control" name="productName" id="productName">
            </div>
              <div class="form-group">
                <label for="clientIp">支付方式</label>
                <input type="text" class="form-control" name="pay_ment" id="pay_ment">
            </div>
            <div class="form-group">
                <label for="clientIp">H5支付方式</label>
                <select class="form-control" name="serviceType" id="serviceType">
                    <option value="wx_h5">微信H5支付</option>
                    <option value="ali_h5">支付宝H5支付</option>
                    <option value="qq_h5">qqH5支付</option>
                    <option value="jd_h5">京东H5支付</option>
                </select>
            </div>
            <span id="mySubmit" class="btn btn-default">提交</span>
        </form>
    </div>
</div>
</body>
</html>